<template>
  <div class="dashboard-container">
    <component :is="currentRole" />
  </div>
</template>

<script >
import { defineComponent, ref, computed, onMounted } from 'vue';
import { useUserStore } from '../stores/user';
import adminDashboard from './admin/index.vue';
// 如果有 editorDashboard 组件，也要引入
// import editorDashboard from './editor/index.vue';

export default defineComponent({
  name: 'Dashboard',
  components: { adminDashboard /*, editorDashboard */ },
  setup() {
    const userStore = useUserStore();
    const currentRole = ref('adminDashboard');

    // 监听角色变化，动态切换仪表盘
    onMounted(() => {
      if (!userStore.roles.includes('admin')) {
        currentRole.value = 'editorDashboard';
      }
    });

    return {
      currentRole,
      roles: computed(() => userStore.roles)
    };
  }
});
</script>
